<template>
	<BaseContainer>
		<el-tabs tab-position="left" v-model="activeName">
			<el-tab-pane v-for="(item, index) in tabs" :key="index" :label="item.label" :name="item.component"> </el-tab-pane>
			<component :is="whichCommon[activeName]"></component>
		</el-tabs>
	</BaseContainer>
</template>

<script setup lang="ts">
import GovSumm from './GovSumm/index.vue'
import DoorServise from './DoorServise/index.vue'
import ServiseCoverage from './ServiseCoverage/index.vue'
import ServiseStatus from './ServiseStatus/index.vue'

const activeName = ref('GovSumm')

const whichCommon = {
	GovSumm,
	DoorServise,
	ServiseCoverage,
	ServiseStatus
}
const tabs = [
	{ label: '政府购买服务统计', component: 'GovSumm' },
	{ label: '居家上门服务统计', component: 'DoorServise' },
	{ label: '服务覆盖面统计', component: 'ServiseCoverage' },
	{ label: '组织服务情况统计', component: 'ServiseStatus' },
]
</script>

<style scoped></style>
